import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/route/route.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/styles.dart';
import 'package:meal/utils/tools.dart';

///
/// 交易快照
///
class TradeSnapshot extends StatefulWidget {
  const TradeSnapshot({Key? key}) : super(key: key);

  @override
  State<TradeSnapshot> createState() => _TradeSnapshotState();
}

class _TradeSnapshotState extends State<TradeSnapshot> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ToolsUtils.getDefaultBackgroundColor(),
      appBar: ToolsUtils.getDefaultBrnAppBar('交易快照'),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              margin: const EdgeInsets.all(Sizes.default20),
              child: Text(
                '交易快照包含订单创建时的商品描述和下单信息，买卖双方和平台在发生交易争议时，该页面作为判定依据。',
                style: StylesUtils.customTextStyle(color: ColorsUtils.color797, lineHeight: 1.8),
              ),
            ),
            Container(
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                padding: const EdgeInsets.symmetric(
                    vertical: Sizes.default10, horizontal: Sizes.default15),
                child: Column(
                  children: [
                    Column(
                      children: [
                        Container(
                          alignment: Alignment.centerLeft,
                          margin: const EdgeInsets.only(bottom: Sizes.default20),
                          child: Text(
                            '订单包含商品',
                            style: StylesUtils.customTextStyle(color: ColorsUtils.color333),
                          ),
                        ),
                        SizedBox(
                          height: Sizes.default70,
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              GFImageOverlay(
                                width: Sizes.default70,
                                height: Sizes.default70,
                                image: const NetworkImage(
                                    'https://img1.baidu.com/it/u=3033226715,2238019049&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),
                                borderRadius: BorderRadius.circular(Sizes.default5),
                              ),
                              Expanded(
                                  child: Container(
                                padding: const EdgeInsets.only(left: Sizes.default10),
                                child: Column(
                                  children: [
                                    Expanded(
                                        child: Container(
                                      alignment: Alignment.topLeft,
                                      child: Text(
                                        '烤肉两人套餐',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color333, fontSize: Sizes.default15),
                                      ),
                                    )),
                                    Expanded(
                                        child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text(
                                          '1,396P',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color333),
                                        ),
                                        Text(
                                          'x2',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color333),
                                        )
                                      ],
                                    ))
                                  ],
                                ),
                              ))
                            ],
                          ),
                        ),
                        Container(
                            margin: const EdgeInsets.symmetric(vertical: Sizes.default10),
                            alignment: Alignment.centerRight,
                            child: InkWell(
                              onTap: () {
                                Get.toNamed(RouteGet.groupOrderSnapshotInfo);
                              },
                              child: Container(
                                alignment: Alignment.center,
                                constraints: const BoxConstraints.expand(
                                    width: Sizes.default90, height: Sizes.default30),
                                decoration: BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: BorderRadius.circular(Sizes.default15),
                                  border: Border.all(color: ColorsUtils.rgba(204, 204, 204, 1)),
                                ),
                                child: Text(
                                  '交易快照',
                                  style: StylesUtils.customTextStyle(
                                      fontSize: Sizes.default13, color: ColorsUtils.color797),
                                ),
                              ),
                            )),
                      ],
                    ),
                    Column(
                      children: [
                        Container(
                          alignment: Alignment.centerLeft,
                          margin: const EdgeInsets.only(bottom: Sizes.default20),
                          child: Text(
                            '订单包含商品',
                            style: StylesUtils.customTextStyle(color: ColorsUtils.color333),
                          ),
                        ),
                        SizedBox(
                          height: Sizes.default70,
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              GFImageOverlay(
                                width: Sizes.default70,
                                height: Sizes.default70,
                                image: const NetworkImage(
                                    'https://img1.baidu.com/it/u=3033226715,2238019049&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),
                                borderRadius: BorderRadius.circular(Sizes.default5),
                              ),
                              Expanded(
                                  child: Container(
                                padding: const EdgeInsets.only(left: Sizes.default10),
                                child: Column(
                                  children: [
                                    Expanded(
                                        child: Container(
                                      alignment: Alignment.topLeft,
                                      child: Text(
                                        '烤肉两人套餐',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color333, fontSize: Sizes.default15),
                                      ),
                                    )),
                                    Expanded(
                                        child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text(
                                          '1,396P',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color333),
                                        ),
                                        Text(
                                          'x1',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color333),
                                        )
                                      ],
                                    ))
                                  ],
                                ),
                              ))
                            ],
                          ),
                        ),
                        Container(
                            margin: const EdgeInsets.symmetric(vertical: Sizes.default10),
                            alignment: Alignment.centerRight,
                            child: InkWell(
                              onTap: () {
                                Get.toNamed(RouteGet.groupOrderSnapshotInfo);
                              },
                              child: Container(
                                alignment: Alignment.center,
                                constraints: const BoxConstraints.expand(
                                    width: Sizes.default90, height: Sizes.default30),
                                decoration: BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: BorderRadius.circular(Sizes.default15),
                                  border: Border.all(color: ColorsUtils.rgba(204, 204, 204, 1)),
                                ),
                                child: Text(
                                  '交易快照',
                                  style: StylesUtils.customTextStyle(
                                      fontSize: Sizes.default13, color: ColorsUtils.color797),
                                ),
                              ),
                            )),
                      ],
                    ),
                  ],
                )),
          ],
        ),
      ),
    );
  }
}
